<template>
  <footer class="mt-8 border-t border-gray-700 py-8">
    <div class="max-w-7xl mx-auto px-4">
      <div class="grid grid-cols-4 gap-8">
        <div v-for="(section, index) in footerSections" :key="index">
          <h4 class="font-semibold mb-4">{{ section.title }}</h4>
          <ul class="space-y-2">
            <li v-for="(link, linkIndex) in section.links" :key="linkIndex">
              <a href="#" class="text-gray-400 hover:text-primary">{{ link }}</a>
            </li>
          </ul>
        </div>
      </div>
      <div class="mt-8 pt-8 border-t border-gray-700 text-center text-gray-400">
        <p>© 2023-2025 瑆皓科技. 保留所有权利.</p>
      </div>
    </div>
  </footer>
</template>

<script setup lang="ts">
const footerSections = [
  {
    title: '产品服务',
    links: ['AI 对话', '智能写作', '图像生成', '代码助手']
  },
  {
    title: '开发资源',
    links: ['API 文档', '开发指南', '示例代码', 'SDK 下载']
  },
  {
    title: '关于我们',
    links: ['公司介绍', '团队文化', '加入我们', '联系方式']
  },
  {
    title: '帮助支持',
    links: ['使用教程', '常见问题', '服务条款', '隐私政策']
  }
];
</script>

<style scoped>
</style>